<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>一个不知名的网站</title>
    <link rel="stylesheet" href="../static/bootstrap-3.4.1-dist/bootstrap/css/bootstrap.css">
    <link rel="stylesheet" href="../static/css/dcalendar.picker.css"/>
    <style>

        .navbar-default .navbar-brand {
            color: #fff;
            font-size: 30px;
            padding-left: 30px

        }

        .navbar-default .navbar-text {
            margin-top: 15px;
            color: #fff;
        }

        .navbar-text {
            color: #fff;
            font-size: 15px
        }

        .nav nav-tabs {
            background-color: #003b95;
        }

        .content-sec3 {
            position: relative;
            max-width: 100%;
            height: auto;
            background: url('../static/img/headerpic.jpeg') no-repeat top center;
            background-size: 100% auto;
            background-color: cadetblue;
        }

        body {
            font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
            font-size: 14px;
            line-height: 1.42857143;
            color: #333;
            background-color: #fff;
        }

        .titleImg {
            width: 200px;
            height: 200px;
            object-fit: cover;
            flex: 1;
        }

        /* Navigation bar */
        .navbar-default {
            background-color: #003B95;
            border-color: #003B95;
            color: #fff;
            font-size: 16px;
        }

        .navbar-default .navbar-brand {
            color: #fff;
            font-size: 30px;
            padding-left: 30px;
        }

        .navbar-default .navbar-text,
        .navbar-default .navbar-nav > li > a {
            color: #fff;
            font-size: 16px;
            font-weight: 500;
        }

        .navbar-default .navbar-text {
            margin-top: 15px;
        }

        /* Breadcrumb */
        .breadcrumb {
            background-color: #fff;
            margin-bottom: 10px;
            padding: 8px 15px;
            border-radius: 4px;
        }

        .breadcrumb > li + li:before {
            content: ">";
            padding: 0 5px;
            color: #ccc;
        }

        /* Left column */
        #left {
            width: 25%;
            padding: 0 15px;
            float: left;
        }

        .leftsmall {
            font-size: 14px;
        }

        .leftsmall > div {
            padding: 10px 0;
        }

        .leftsmall .input-group {
            margin-bottom: 10px;
        }

        .leftsmall .input-group-addon {
            background-color: #fff;
            border: none;
        }

        .leftsmall .form-control {
            border-radius: 0;
        }

        .leftsmall .btn-primary {
            background-color: #003B95;
            border-color: #003B95;
            width: 100%;
            border-radius: 0;
            font-size: 16px;
        }

        .leftsmall .btn-primary:hover {
            background-color: #428BCA;
            border-color: #428BCA;
        }

        /* Right column */
        #right {
            width: 75%;
            padding: 0 15px;
            float: right;
        }

        .maps-overlay {
            position: relative;
            height: 100%;
            background: #F9F9F9;
            border: 1px solid #E5E5E5;
        }

        border {
            border-style: solid;
            border-width: medium;
        }

        .radio_labels {
            padding: 5px;
            font-size: 14px;
            font-weight: 400;
            text-align: center;
            display: inline-block;
            position: relative;
            cursor: pointer;
        }

        .blu_container {
            border: 1px solid #e7e7e7;
            margin-top: 20px;
            border-radius: 2px;
            padding: 10px 20px;
            background: #ebf3ff
        }

        .res_room_info {
            margin-top: 0;
        }

        .green_title {
            font-size: 14px;
            font-weight: 700;
            line-height: 20px;
            color: #008009;
            display: inline-block;
            padding: 0px 15px 0px 15px;
        }

        .bk-icon {
            vertical-align: middle;
        }

        .res_room_fil_little_card {
            display: inline-block;
            background-color: #e7fde9;
            border: 1px solid #97e59c;
            border-radius: 2px;
            color: #006607;
            margin: 4px 0 0 4px
        }

        .input_form {
            display: block;
            border: 1px solid #aaa;
            padding: 4px 24px 4px 8px;
            line-height: 25px;
            border-radius: 4px;
        }

        .res_rooms_container {
            margin-bottom: 20px;
        }

        .li_no_point {
            list-style-type: none;
            padding-left: 0;
        }

        .normal_inline {
            display: inline-block;
            padding-left: 10px;
            text-align: center;
            font-size: 14px;
            font-weight: 350;
        }

        ul {
            margin-block-start: 1em;
            margin-block-end: 1em;
            margin-inline-start: 0px;
            margin-inline-end: 0px;
            padding-inline-start: 40px;
        }

        select {
            writing-mode: horizontal-tb;
            text-rendering: auto;
            letter-spacing: normal;
            word-spacing: normal;
            line-height: normal;
            text-transform: none;
            text-indent: 0px;
            text-shadow: none;
            display: inline-block;
            text-align: start;
            appearance: auto;
            box-sizing: border-box;
            align-items: center;
            white-space: pre;
            -webkit-rtl-ordering: logical;
            cursor: default;
            margin: 0em;
            border-width: 1px;
            border-style: solid;
            border-image: initial;
        }

        .score_blue_pattern {
            display: inline-block;
            border-radius: 5px 5px 5px 0;
            height: 24px;
            min-width: 24px;
            width: 24px;
            align-items: center;
            background: #003580;
            color: #fff;
            justify-content: center;
            vertical-align: center;
            text-align: center;
            font-size: small;
            line-height: 25px
        }

        .small_facs {
            display: inline-block;
            padding-right: 6px;
        }

        .little_font {
            display: inline-block;
            font-size: 12px;
            font-weight: 400;
            line-height: 18px;
        }
.dropdown{
            position: relative;
            display: inline-block;
        }
        .dropbtn{
            background-color: #003B95;
            color: white;
            font-size: 16px;
            padding: 16px;
            border: none;
            cursor: pointer;
        }
        .dropdown-content{
            display: none;
            position: absolute;
            background-color: white;
            width: 100%;
            box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        }
        .dropdown-content a{
            color: black;
            padding: 12px 16px;
            text-decoration:  none;
            display: block;
        }
        .dropdown-content a:hover{
            background-color: #b9def0;
        }
        .dropdown:hover .dropdown-content{
            display: block;
        }
        .dropdown:hover .dropbtn{
            background-color: #003B95;
        }
        .little_icon {
            display: inline-block;
            height: 16px;
            width: 16px;
            vertical-align: -3px;
        }

        .hide {
            display: none;
        }

        .star_hide {
            display: none;
        }
    </style>
</head>
<body>
<nav class="navbar navbar-default" style="background-color: #003b95   ">

    <div class="container-fluid ">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                    data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <div class="container">
                <a class="navbar-brand " href="https://www.booking.cn">Booking.com</a>
            </div>
        </div>
        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav navbar-right">
                <li><p class="navbar-text ">上线我的住宿</p></li>
               <li><div class="dropdown"style="z-index: 9999">
                    <button class="dropbtn">欢迎预定！</button>
                    <div class="dropdown-content">
                        <a href="/fake">查看订单 </a>
                        <a href="/logout">退出 </a>
                    </div>
                </div></li>
                </li>
            </ul>
        </div><!-- /.navbar-collapse -->
    </div><!-- /.container-fluid -->
</nav>
<div class="container">
    <span class="glyphicon glyphicon-ok" aria-hidden="true" style="font-size: 20px"><b>已选宿舍&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;</b></span>
    <span class="glyphicon glyphicon-ok" aria-hidden="true" style="font-size: 20px"><b>个人信息&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;</b></span>
    <span class="glyphicon glyphicon-pencil" aria-hidden="true" style="font-size: 20px"><b>最后一步</b></span>
    <div class="col-lg-4">
        <div style="border:1px solid darkgrey;margin-top: 30px;padding:10px">
            <p style="font-size:20px"><b>订单情况</b></p>
            <div class="row">
                <div class="col-lg-6">
                    <p>入住时间</p>
                    <p style="font-size:16px"><b>{{checkin}}</b></p>
                </div>
                <div class="col-lg-6">
                    <p>退房时间</p>
                    <p style="font-size:16px"><b>{{checkout}}</b></p>
                </div>
            </div>
            <p>入住总天数：</p>
            <p><b>{{time}}晚</b></p>
            <p>&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;&mdash;</p>
            <p><b>已选择：</b></p>
            {% for item in room%}
            <div>
                <span>{{item.bedtype}}</span>

            </div>
            {% endfor %}
        </div>
        <div style="border:1px solid darkgrey;margin-top: 30px;padding:10px">
            <p style="font-size:20px"><b>价格汇总</b></p>
            <div style="background: #ebf3ff">
                <p style="font-size:20px;padding-left: 10px"><b>价格&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{price}}元</b>
                </p>
            </div>
            <p style="font-size: 15px"><b>价格信息</b></p>
            <p style="font-size:15px;padding-left: 10px">不含US$6.77税费和其他费用</p>
            <p style="font-size:15px;padding-left: 10px">损毁押金 (可全额退还)</p>
            <p style="font-size:15px;padding-left: 10px">以US$显示的价格仅为估算参考，您将以元进行付款。支付时，汇率可能会有所变动。</p>
            <p style="font-size:15px;padding-left: 10px">请注意，您的发卡行可能会收取境外交易手续费。</p>
        </div>
        <div style="border:1px solid darkgrey;margin-top: 30px;padding:10px">
            <p style="font-size:16px"><b>取消费是多少？</b></p>
            <p style="font-size:15px;padding-left: 10px">{{checkin}}下午5:59前可以免费取消</p>
            <p style="font-size:15px;padding-left: 10px">{{checkin}}下午6:00起</p>
        </div>
    </div>
    <div class="col-lg-8">
        <div style="border:1px solid #e7e7e7;margin-top: 30px;padding:10px">
            <div class="row">
                <div class="col-lg-3">
                    <img data-src="holder.js/100%x180" alt="160x160"
                         style="height: 160px; width: 160px; display: block;" src="{{img}}"
                         data-holder-rendered="true">
                </div>
                <div style="display: inline-block">
                    <p style="display: inline-block">{{information[0].htype}}</p>
                    <p class="hide" id="show_stars">{{information[0].star}}</p>
                    <span class="star_hide" aria-hidden="true" style="fill:#febb02"><svg
                            xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="12px" height="12px"><path
                            d="M24 12c0 6.627-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0s12 5.373 12 12z"></path></svg></span>
                    <span class="star_hide" aria-hidden="true" style="fill:#febb02"><svg
                            xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="12px" height="12px"><path
                            d="M24 12c0 6.627-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0s12 5.373 12 12z"></path></svg></span>
                    <span class="star_hide" aria-hidden="true" style="fill:#febb02"><svg
                            xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="12px" height="12px"><path
                            d="M24 12c0 6.627-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0s12 5.373 12 12z"></path></svg></span>
                    <span class="star_hide" aria-hidden="true" style="fill:#febb02"><svg
                            xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="12px" height="12px"><path
                            d="M24 12c0 6.627-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0s12 5.373 12 12z"></path></svg></span>
                    <span class="star_hide" aria-hidden="true" style="fill:#febb02"><svg
                            xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="12px" height="12px"><path
                            d="M24 12c0 6.627-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0s12 5.373 12 12z"></path></svg></span>
                </div>
                <div style="display: inline-block">
                    <span class="star_hide" id="star_good" aria-expanded="false"
                          class="b6dc9a9e69 ee74cdff9b ec1b6253a6 fe3639fe67" aria-hidden="true"><svg
                            xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 128 128"
                            style="vertical-align: -6px"><path fill="#FEBB02"
                                                               d="M112 8H16a8 8 0 0 0-8 8v96a8 8 0 0 0 8 8h96a8 8 0 0 0 8-8V16a8 8 0 0 0-8-8zM48 96H24V58h24zm56-25a8.697 8.697 0 0 1-2 6 8.903 8.903 0 0 1 1 4 6.9 6.9 0 0 1-5 7c-.5 4-4.8 8-9 8H56V58l10.3-23.3a5.4 5.4 0 0 1 10.1 2.7c-.078.923-.28 1.831-.6 2.7L72 52h23c4.5 0 9 3.5 9 8a9.2 9.2 0 0 1-2 5.3 7.5 7.5 0 0 1 2 5.7z"></path></svg></span>
                </div>
                <p style="font-size: 18px"><b>{{information[0].hname}}</b></p>
                <p style="font-size: 15px">{{information[0].address}}</p>
                <div>
                    <div aria-label="评分9.5" class="score_blue_pattern" id="pinfen">6.8</div>
                    <p style="font-size: 10px;color:green;display: inline-block">位置很好-8.0</p>
                </div>
                <p style="font-size: 10px" id="pinji"></p>
                <div style="display: inline-block">
                    {% for item in fac[0].f2%}
                    <div class="small_facs">
                        <span data-testid="icon-with-text-icon" class="little_icon" aria-hidden="false"></span>
                        <span class="little_font">{{item}}</span>
                    </div>
                    {% endfor %}
                </div>
            </div>
        </div>
        <div style="border:1px solid #e7e7e7;margin-top: 30px;padding:10px">
            <p style="font-size: 25px"><b>温馨提示：</b></p>
            <p style="font-size: 15px"><span class="glyphicon glyphicon-credit-card" aria-hidden="true"></span>无需信用卡！
            </p>
            <p style="font-size: 15px"><span class="glyphicon glyphicon-triangle-right" aria-hidden="true"></span>保持灵活：{{checkin}}前（含）可免费取消，所以今天就锁定该好价吧！
            </p>
        </div>
        <div class="res_container blu_container">
            <p style="font-size: 20px"><b>输入个人信息</b></p>
            <div>
                <div style="background: #d2edd5;padding: 0.4em 0.8em;border-radius: 4px;display: inline-block;color: #006607;text-align: left;">
                    <p style="display: inline-block ;line-height: 0px">
                        快完成啦！将带<b style="color: #a30000">*</b> 的必填项填写完整即可
                    </p>
                </div>
            </div>
            <div>
                <div class="reservation_self_information" style="padding: 20px 0px">
                    <div style="font-weight: 700;display: block; margin: 0 0 4px;padding: 0;padding-inline-start: 2px;padding-inline-end: 2px;">
                        出行类别:
                    </div>
                    <div>
                        <input type="radio" name="travel_type" value="business"
                               style="zoom: 160%;background-color: #0071c2"><span class="radio_labels"> 出差</span>
                        <input type="radio" name="travel_type" value="leisure"
                               style="zoom: 160%;background-color: #0071c2"><span class="radio_labels"> 自由行</span>
                    </div>
                    <div id="lastname" style="padding: 10px 0px;display: inline-block">
                        <label>姓（拼音或英语）</label><b style=" color: #a30000; font-size: 15px; line-height: 0">*</b>
                        <input class="input_form" type="text" placeholder="例：Zhang" value size="20"
                        >
                    </div>
                    <div id="firstname" style="padding: 10px 20px;display: inline-block">
                        <label>名（拼音或英语）</label><b style=" color: #a30000; font-size: 15px; line-height: 0">*</b>
                        <input type="text" placeholder="例：Xiaoming" value size="20"
                               class="input_form">
                    </div>
                    <div id="email" style="padding: 10px 0px">
                        <label>电子邮箱地址</label><b style=" color: #a30000; font-size: 15px; line-height: 0">*</b>
                        <input type="text" placeholder="温馨提示：填写后检查一下，避免拼写错误" value size="40"
                               class="input_form">
                    </div>
                    <div style="display: inline-block;color: #6b6b6b">
                        确认邮件将发送至该邮箱
                    </div>
                    <div style="padding:16px 0px 0px 0px ">
                        <label>您是为谁预订?</label>
                        <div>
                            <input type="radio" name="travel_type" value="business"
                                   style="display: inline-block; zoom: 160%;background-color: #0071c2"><span
                                class="radio_labels"> 本人即住客（之一）</span>
                        </div>
                        <div>
                            <input type="radio" name="travel_type" value="leisure"
                                   style="display: inline-block;zoom: 160%;background-color: #0071c2"><span
                                class="radio_labels"> 本人不会入住</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        {% for item in room%}
        <div class="res_rooms_container ">
            <div class="blu_container">
                <div class="res_room_info" style="display: inline-block">
                    <div>
                        <p style="font-size: 20px;margin-top: 10px;display: inline-block"><b>{{item.ordernum}}套{{item.roomname}}</b>
                        </p>
                        <a class="room_remove" href="" role="button"
                           style="color: #c00;display: inline-block;padding: 8px 0cm 8px 13.0cm">
                            <span><svg class="bk-icon -streamline-close" height="16" width="16" fill="#c00"
                                       viewBox="0 0 24 24" role="presentation" aria-hidden="true" focusable="false"><path
                                    d="M13.31 12l6.89-6.89a.93.93 0 1 0-1.31-1.31L12 10.69 5.11 3.8A.93.93 0 0 0 3.8 5.11L10.69 12 3.8 18.89a.93.93 0 0 0 1.31 1.31L12 13.31l6.89 6.89a.93.93 0 1 0 1.31-1.31z"></path></svg></span>
                        </a>
                    </div>
                    <div>
                        <div style="display:inline-block; line-height: 0px;padding: 10px 0px 0px 0px">
                            <svg class="bk-icon -streamline-food_coffee" fill="#008009" height="20" role="presentation"
                                 width="20" viewBox="0 0 24 24" aria-hidden="true" focusable="false"
                                 style="vertical-align:middle">
                                <path d="M3.75 4.5h12a.75.75 0 0 1 .75.75v7.5a6.75 6.75 0 0 1-13.5 0v-7.5a.75.75 0 0 1 .75-.75zm0-1.5A2.25 2.25 0 0 0 1.5 5.25v7.5a8.25 8.25 0 0 0 16.5 0v-7.5A2.25 2.25 0 0 0 15.75 3h-12zm-3 18h22.5a.75.75 0 0 0 0-1.5H.75a.75.75 0 0 0 0 1.5zm16.5-15h1.5a3.763 3.763 0 0 1 3.75 3.752 3.762 3.762 0 0 1-3.752 3.748H17.1a.75.75 0 0 0 0 1.5h1.65A5.263 5.263 0 0 0 24 9.752 5.264 5.264 0 0 0 18.752 4.5H17.25a.75.75 0 0 0 0 1.5z"></path>
                            </svg>
                        </div>
                        <div class="green_title">
                            {% for item2 in item.roomsbreakfast %}
                            <span>{{item2}}</span>
                            {% endfor %}
                        </div>
                    </div>
                    <div>
                        <div style="display:inline-block; line-height: 0px;padding: 10px 0px 0px 0px">
                            <span>
                                <svg class="bk-icon -streamline-checkmark_selected" fill="#008009" height="16"
                                     role="presentation" width="16" viewBox="0 0 128 128" aria-hidden="true"
                                     focusable="false" style="vertical-align:middle"><path
                                        d="M56.62 93.54a4 4 0 0 1-2.83-1.18L28.4 67a4 4 0 1 1 5.65-5.65l22.13 22.1 33-44a4 4 0 1 1 6.4 4.8L59.82 91.94a4.06 4.06 0 0 1-2.92 1.59zM128 64c0-35.346-28.654-64-64-64C28.654 0 0 28.654 0 64c0 35.346 28.654 64 64 64 35.33-.039 63.961-28.67 64-64zm-8 0c0 30.928-25.072 56-56 56S8 94.928 8 64 33.072 8 64 8c30.914.033 55.967 25.086 56 56z"></path></svg>
                            </span>
                        </div>
                        <div style=" display: inline-block;color: #008009;font-size:12px;font-weight: 400;border-bottom-color: #008009;padding: 0px 16px 0px 16px;">
                            {% for item2 in item.roomcancel %}
                            <span> {{item2}}</span>
                            {% endfor %}
                            <button style="border: 0;background: 0;padding: 0;font-size: inherit;vertical-align: middle">
                                <svg class="bk-icon -streamline-question_mark_circle" fill="#0071C2" height="16"
                                     width="16" viewBox="0 0 24 24" role="presentation" aria-hidden="true"
                                     focusable="false">
                                    <path d="M9.75 9a2.25 2.25 0 1 1 3 2.122 2.25 2.25 0 0 0-1.5 2.122v1.006a.75.75 0 0 0 1.5 0v-1.006c0-.318.2-.602.5-.708A3.75 3.75 0 1 0 8.25 9a.75.75 0 1 0 1.5 0zM12 16.5a1.125 1.125 0 1 0 0 2.25 1.125 1.125 0 0 0 0-2.25.75.75 0 0 0 0 1.5.375.375 0 1 1 0-.75.375.375 0 0 1 0 .75.75.75 0 0 0 0-1.5zM22.5 12c0 5.799-4.701 10.5-10.5 10.5S1.5 17.799 1.5 12 6.201 1.5 12 1.5 22.5 6.201 22.5 12zm1.5 0c0-6.627-5.373-12-12-12S0 5.373 0 12s5.373 12 12 12 12-5.373 12-12z"></path>
                                </svg>
                            </button>
                        </div>
                    </div>
                    <div style="line-height: 0px;padding: 10px 0px 0px 0px">
                        <div style="display: inline-block">
                            <span>
                                <svg class="bk-icon -streamline-no_smoking" fill="#333333" height="16" width="16"
                                     viewBox="0 0 24 24" role="presentation" aria-hidden="true" focusable="false"
                                     style="vertical-align: middle"><path
                                        d="M19.5 9h2.25a.75.75 0 0 1 .75.75v3a.75.75 0 0 1-.75.75h-7.5a.75.75 0 0 0 0 1.5h7.5A2.25 2.25 0 0 0 24 12.75v-3a2.25 2.25 0 0 0-2.25-2.25H19.5a.75.75 0 0 0 0 1.5zM5.25 13.5h-1.5l.75.75v-6L3.75 9h7.5a.75.75 0 0 0 0-1.5h-7.5a.75.75 0 0 0-.75.75v6c0 .414.336.75.75.75h1.5a.75.75 0 0 0 0-1.5zM15 12v2.25a.75.75 0 0 0 1.5 0V12a.75.75 0 0 0-1.5 0zM0 8.25v6a.75.75 0 0 0 1.5 0v-6a.75.75 0 0 0-1.5 0zm1.28 15.53l22.5-22.5A.75.75 0 0 0 22.72.22L.22 22.72a.75.75 0 1 0 1.06 1.06zM4.5.75A2.25 2.25 0 0 1 2.25 3 2.25 2.25 0 0 0 0 5.25a.75.75 0 0 0 1.5 0 .75.75 0 0 1 .75-.75A3.75 3.75 0 0 0 6 .75a.75.75 0 0 0-1.5 0z"></path></svg>
                            </span>
                        </div>
                        <div style="display: inline-block ;padding: 0px 15px">
                            <span style="color: #6b6b6b ">
                                禁止吸烟
                            </span>
                        </div>
                    </div>
                    <div style="line-height: 0px;padding: 10px 0px 0px 0px">
                        {% for item2 in item.roomfacilities %}
                        <div class="res_room_fil_little_card">
                            <div style="padding:2px 4px ">
                                <span style="font-size: 12px;font-weight: 400;padding: 10px 0">
                                    <svg class="bk-icon -streamline-room_size" fill="#008009" height="16" width="16"
                                         viewBox="0 0 24 24" role="presentation" aria-hidden="true" focusable="false"><path
                                            d="M3.75 23.25V7.5a.75.75 0 0 0-1.5 0v15.75a.75.75 0 0 0 1.5 0zM.22 21.53l2.25 2.25a.75.75 0 0 0 1.06 0l2.25-2.25a.75.75 0 1 0-1.06-1.06l-2.25 2.25h1.06l-2.25-2.25a.75.75 0 0 0-1.06 1.06zM5.78 9.22L3.53 6.97a.75.75 0 0 0-1.06 0L.22 9.22a.75.75 0 1 0 1.06 1.06l2.25-2.25H2.47l2.25 2.25a.75.75 0 1 0 1.06-1.06zM7.5 3.75h15.75a.75.75 0 0 0 0-1.5H7.5a.75.75 0 0 0 0 1.5zM9.22.22L6.97 2.47a.75.75 0 0 0 0 1.06l2.25 2.25a.75.75 0 1 0 1.06-1.06L8.03 2.47v1.06l2.25-2.25A.75.75 0 1 0 9.22.22zm12.31 5.56l2.25-2.25a.75.75 0 0 0 0-1.06L21.53.22a.75.75 0 1 0-1.06 1.06l2.25 2.25V2.47l-2.25 2.25a.75.75 0 0 0 1.06 1.06zM10.5 13.05v7.2a2.25 2.25 0 0 0 2.25 2.25h6A2.25 2.25 0 0 0 21 20.25v-7.2a.75.75 0 0 0-1.5 0v7.2a.75.75 0 0 1-.75.75h-6a.75.75 0 0 1-.75-.75v-7.2a.75.75 0 0 0-1.5 0zm13.252 2.143l-6.497-5.85a2.25 2.25 0 0 0-3.01 0l-6.497 5.85a.75.75 0 0 0 1.004 1.114l6.497-5.85a.75.75 0 0 1 1.002 0l6.497 5.85a.75.75 0 0 0 1.004-1.114z"></path>
                                    </svg>
                                 {{item2}}
                                </span>
                            </div>
                        </div>
                        {% endfor %}
                    </div>
                </div>
                <div style="margin: 16px 0 0">
                    <strong> 最多人数：</strong>
                    <span id="show_peoples" style="display: none">{{item.maxpeople}}</span>
                    <span style="display: inline-block" id="max_people_icon"></span>
                </div>
                <div style="margin: 16px 0 0;">
                    <div style="display: inline-grid;padding-bottom: 0">
                        <div style="padding-bottom: 0 ">
                            <label style="display: block;">住客全名</label>
                            <input type="text" placeholder="姓（拼音或英语）名（拼音或英语）" value size="36"
                                   class="input_form">
                        </div>
                    </div>
                    <div style="padding: 0 20px;display: inline-grid">
                        <label style="display: block;padding-bottom: 0">客人的电邮<p
                                style=" color:#6b6b6b;font-weight: 100;display:inline-block;margin: 0;padding-left: 10px">
                            (可选) </p></label>
                        <input type="text" placeholder="电子邮箱地址" value size="35"
                               class="input_form">
                        <div style="display: block;width: 310px; ">
                            <div style="color:#6b6b6b;padding: 0 0 ;font-size: 12px;line-height: 18px;display: block">
                                电子邮箱地址仅用于接收订单相关信息，<b>我们保证</b>不会向您发送广告邮件。
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        {% endfor %}
        <div class="blu_container">
            <div style="padding-top: 10px">
                <label style="display: block;font-size: 20px;font-weight: 700;line-height: 28px">您还有什么特别要求？</label>
            </div>
            <div style="margin: 16px 0 0">
                <div style="font-size: 14px;font-weight: 400">
                    <p>特殊要求无法保证满足，但住宿将尽力为你提供所需。你始终可以在预订完成后提出特殊要求。</p>
                </div>
                <div>
                    <span style="font-weight: 700;font-size: 14px">请使用英语或中文填写您的请求。</span>
                    <p style=" color:#6b6b6b;font-weight: 100;display:inline-block;margin: 0;padding-left: 10px">
                        (可选) </p>
                </div>
                <div class="textarea">
                    <textarea name="remarks" id="remarks" rows="3"
                              style="height: 76px;border: 1px solid #aaa;font-size:16px;padding-right: 32px;max-width: 100%;min-width: 100%;border-radius: 2px;cursor: text;"></textarea>
                </div>
                <div style="margin-bottom: 8px">
                    <input id="same_area_rooms" type="checkbox" class="bui-checkbox__input" value="1"
                           style=" background: #fff; border:1px solid #aaa; outline: 0;vertical-align:-4px;zoom: 150%">
                    <span style="display: inline-block;text-align: center">请安排彼此相邻的客房（如有空房）     </span>
                </div>
            </div>
        </div>
        <div class="blu_container " style="margin-bottom: 20px">
            <div style="padding-top: 10px">
                <label style="display: block;font-size: 20px;font-weight: 700;line-height: 28px">到店时间</label>
            </div>
            <div>
                <div>
                    <div style=" padding-top: 10px;padding-left: -7px">
                            <span>
                                <svg class="bk-icon -streamline-checkmark_selected" fill="#008009" height="24"
                                     width="24" viewBox="0 0 128 128" role="presentation" aria-hidden="true"
                                     focusable="false"><path
                                        d="M56.62 93.54a4 4 0 0 1-2.83-1.18L28.4 67a4 4 0 1 1 5.65-5.65l22.13 22.1 33-44a4 4 0 1 1 6.4 4.8L59.82 91.94a4.06 4.06 0 0 1-2.92 1.59zM128 64c0-35.346-28.654-64-64-64C28.654 0 0 28.654 0 64c0 35.346 28.654 64 64 64 35.33-.039 63.961-28.67 64-64zm-8 0c0 30.928-25.072 56-56 56S8 94.928 8 64 33.072 8 64 8c30.914.033 55.967 25.086 56 56z"></path></svg>
                            </span>
                            <div class="normal_inline">客房15:00可办理入住</div>
                    </div>
                    <div style="padding-top:10px ">
                            <span>
                                <svg class="bk-icon  -streamline-checkmark_selected" fill="#008009" height="24"
                                     width="24" viewBox="0 0 24 24" role="presentation" aria-hidden="true"
                                     focusable="false"><path
                                        d="M14.244 14.156a6.75 6.75 0 0 0-6.75-5.906A6.747 6.747 0 0 0 .73 14.397a.75.75 0 0 0 1.494.134 5.25 5.25 0 0 1 5.27-4.781 5.253 5.253 0 0 1 5.262 4.594.75.75 0 1 0 1.488-.188zM10.125 4.125a2.625 2.625 0 1 1-5.25 0V1.5h5.25v2.625zm1.5 0V1.5a1.5 1.5 0 0 0-1.5-1.5h-5.25a1.5 1.5 0 0 0-1.5 1.5v2.625a4.125 4.125 0 0 0 8.25 0zM23.25 22.5H.75l.75.75v-7.5a.75.75 0 0 1 .75-.75h19.5a.75.75 0 0 1 .75.75v7.5l.75-.75zm0 1.5a.75.75 0 0 0 .75-.75v-7.5a2.25 2.25 0 0 0-2.25-2.25H2.25A2.25 2.25 0 0 0 0 15.75v7.5c0 .414.336.75.75.75h22.5zM4.376 5.017a9.42 9.42 0 0 1 3.12-.517 9.428 9.428 0 0 1 3.133.519.75.75 0 0 0 .49-1.418A10.917 10.917 0 0 0 7.498 3a10.91 10.91 0 0 0-3.611.6.75.75 0 0 0 .49 1.417zM15.75 14.27a3.001 3.001 0 0 1 6 .16.75.75 0 1 0 1.5.04 4.501 4.501 0 1 0-9-.24.75.75 0 1 0 1.5.04zm3.75-3.77V8.25a.75.75 0 0 0-1.5 0v2.25a.75.75 0 0 0 1.5 0zM17.25 9h3a.75.75 0 0 0 0-1.5h-3a.75.75 0 0 0 0 1.5z"></path></svg>
                            </span>
                        <div class="normal_inline">24小时前台 - 随时提供帮助！</div>
                    </div>
                </div>
                <div style="padding-top: 18px;">
                    <label style="display: block;padding-bottom: 0">添加预计到店时间
                        <p style=" color:#6b6b6b;font-weight: 100;display:inline-block;margin: 0;padding-left: 10px">
                            (可选) </p>
                    </label>
                    <div class="bui-input-select" style="margin-bottom: 6px">
                        <select name="checkin_eta_hour" class="bui-form__control" id="checkin_eta_hour"
                                style="color: #262626; background: #fff; border: 1px solid #aaa; border-radius: 4px;width: 9cm;height:40px;font-size: 16px; padding-left:10px;padding-right: 32px; position: relative;">
                            <option value="" disabled="" selected="">请选择</option>
                            <option value="-1">不确定</option>
                            <option value="0">0:00 – 1:00</option>
                            <option value="1">1:00 – 2:00</option>
                            <option value="2">2:00 – 3:00</option>
                            <option value="3">3:00 – 4:00</option>
                            <option value="4">4:00 – 5:00</option>
                            <option value="5">5:00 – 6:00</option>
                            <option value="6">6:00 – 7:00</option>
                            <option value="7">7:00 – 8:00</option>
                            <option value="8">8:00 – 9:00</option>
                            <option value="9">9:00 – 10:00</option>
                            <option value="10">10:00 – 11:00</option>
                            <option value="11">11:00 – 12:00</option>
                            <option value="12">12:00 – 13:00</option>
                            <option value="13">13:00 – 14:00</option>
                            <option value="14">14:00 – 15:00</option>
                            <option value="15">15:00 – 16:00</option>
                            <option value="16">16:00 – 17:00</option>
                            <option value="17">17:00 – 18:00</option>
                            <option value="18">18:00 – 19:00</option>
                            <option value="19">19:00 – 20:00</option>
                            <option value="20">20:00 – 21:00</option>
                            <option value="21">21:00 – 22:00</option>
                            <option value="22">22:00 – 23:00</option>
                            <option value="23">23:00 – 0:00</option>
                            <option value="24">0:00 – 1:00 （次日）</option>
                            <option value="25">1:00 – 2:00 （次日）</option>
                        </select>
                        <div style="padding-top: 10px;color: #6b6b6b">该时间为北京时间</div>
                    </div>
                </div>
            </div>
        </div>
        <div class="confirm-button-line" style="padding-top: 5px;">

            <div style="display:inline-grid;text-align: -moz-right; margin-bottom: 20px;float:right">
                <form method="post">
                    <button type="submit" name="book" data-bui-component="Popover" data-popover-position="top end"
                            style="width: 200px;border:1px solid #0071c2;border-radius: 2px;background-color: #0071c2;color: #fff;vertical-align: middle;fill: #fff">
                        <span style="display: inline-block;line-height: 40px"> 下一步：最终信息 </span>
                        <span>
                            <svg height="24" role="presentation" width="24" viewBox="0 0 24 24" aria-hidden="true"
                             focusable="false" style="vertical-align: -7px"><path
                                d="M9.45 6c.2 0 .39.078.53.22l5 5c.208.206.323.487.32.78a1.1 1.1 0 0 1-.32.78l-5 5a.75.75 0 0 1-1.06 0 .74.74 0 0 1 0-1.06L13.64 12 8.92 7.28a.74.74 0 0 1 0-1.06.73.73 0 0 1 .53-.22zm4.47 5.72zm0 .57z"></path>
                        </svg>
                        </span>
                    </button>
                </form>
            </div>
            <div style="clear:both;display: inline-block"></div>
            <div style="display:inline-block;padding: 15px 8px;float:right;">
                <button data-testid="price-match-trigger" aria-expanded="false" type="button"
                        style="border:1px solid #FFFFFF;color: #0071c2;cursor: pointer;text-align: right;width: auto;padding-right: 10px;background-color: #FFFFFF">
               <span>
                    <span aria-hidden="true">
                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"
                             style="fill:#0071c2;height:20px;width: 20px;vertical-align: middle"><path
                                d="M.311 2.56v6.257a3.75 3.75 0 0 0 1.098 2.651l11.56 11.562a2.25 2.25 0 0 0 3.182 0l6.88-6.88a2.25 2.25 0 0 0 0-3.181L11.468 1.408A3.75 3.75 0 0 0 8.818.31H2.56a2.25 2.25 0 0 0-2.25 2.25zm1.5 0a.75.75 0 0 1 .75-.75h6.257a2.25 2.25 0 0 1 1.59.659l11.562 11.56a.75.75 0 0 1 0 1.06l-6.88 6.88a.75.75 0 0 1-1.06 0L2.47 10.409a2.25 2.25 0 0 1-.659-1.59V2.56zm5.25 3.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0zm1.5 0a2.25 2.25 0 1 0-4.5 0 2.25 2.25 0 0 0 4.5 0z"></path>
                        </svg>
                    </span>
               </span>
                    <span>价格更放心</span>
                </button>
            </div>
            <div style="clear:both ;"></div>

        </div>
        <div style="text-align: end;margin-bottom: 20px">
            <div style="font-size: 14px;color: #0071c2;font-weight: bold;display: inline;text-decoration: underline;text-decoration-color:#0071c2  ">
                <a href="" target="_blank" data-component="popup-open" data-width="600" data-height="580"
                   data-bui-component="Tooltip" data-tooltip-position="top"
                   data-tooltip-text="点击链接即可查看预订政策详情，包括：取消订单、预付款、税费及其他费用">订单条款是什么？</a>
            </div>
        </div>
    </div>
</div>
<div>
    <section id="hh4" class="pt-5 pb-5 bg-warning rounded mt-5 mb-5 aos-init aos-animate" data-aos="zoom-in">
        <div class="container text-center">
            <h1 class="mb-3 mt-3">Like what you see?</h1>
            <h3 class="font-weight-light mb-5">方便又省钱！
                <em><strong></strong></em> 立即注册，获取优惠好价！ </h3>
            <div class="row justify-content-center mb-5">
                <div class="col-lg-4">
                </div>
                <div class="col-lg-4">
                    <a target="_blank" class="btn btn-dark shadow-lg btn-lg d-block mb-2 btn-round"
                       href="https://join.booking.com/?lang=zh-cn&aid=376390&utm_source=footer_menu&utm_medium=frontend&label=bookings-naam-oYFnc5Uc4A3ORKdyD8eI7AS632911532530:pl:ta:p1:p22,563,000:ac:ap:neg:fi:tikwd-65526620:lp1009280:li:dec:dm:ppccp=UmFuZG9tSVYkc2RlIyh9YXdX6HrtnYy-wu9AdI9VTio">
                        <i class="fab fa-github mr-1"></i> 上线我的住宿</a>
                </div>
            </div>
        </div>
    </section>
</div>
<div style="border:solid 2px black"></div>
<div class="footerconstraint-inner container" style="margin-top: 10px">
    <div id="footer" class="footer-navigation-links-wrapper clearfix" role="navigation">
        <div id="footer_links" class="footer-navigation-links">
            <div class="footer-navigation-links-column footer-seo-links-to-html-sitemaps">
                <ul class="footer-navigation-links-list col-xs-6 col-md-2">
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/country.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="seoindexlinks">
                            国家/地区
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/region.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="seoindexlinks">
                            区域
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/city.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="seoindexlinks">
                            城市
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/district.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="seoindexlinks">
                            区
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/airport.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="seoindexlinks">
                            机场
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/hotel/index.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="seoindexlinks">
                            酒店
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/landmark.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="seoindexlinks">
                            周边地标/景点
                        </a>
                    </li>
                </ul>
            </div>
            <div class="footer-navigation-links-column">
                <ul class="footer-navigation-links-list footer-seo-links-to-index col-xs-6 col-md-2">
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/booking-home/index.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="booking-home">
                            民宿短租
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/apartments/index.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="apartments">
                            公寓
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/resorts/index.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="resorts">
                            度假村
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/villas/index.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="villas">
                            别墅
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/hostels/index.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="hostels">
                            青旅
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/bed-and-breakfast/index.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="bed_and_breakfast">
                            住宿加早餐旅馆
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/guest-house/index.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="guest_house">
                            旅馆
                        </a>
                    </li>
                </ul>
            </div>
            <div class="footer-navigation-links-column">
                <ul class="footer-navigation-links-list col-xs-6 col-md-3">
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/accommodations.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="accommodations">
                            全球独特住宿
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/destination.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="destinations">
                            所有目的地
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/flights/sitemap.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="flights_destinations">
                            所有航班目的地
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/cars/sitemap.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="cars_destinations">
                            所有租车点
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="/discover.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc">
                            发现精彩
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/reviews
.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc
" data-ga="seoindexlinks" class="js-reviews-footer-link">
                            客人点评
                        </a>
                    </li>
                    <div data-et-view="  BHDTJdReLLCBLZBeMbFMOFIbeDUHYKe:1 BHDTJdReLLCBLZBeMbFMOFIbeDUHYKe:3 "></div>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/extended-stays/index.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           data-ga="extended-stays">
                            探索月租
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://booking.cn/articles.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           type="nav" location="main-site-footer" category="articles-link">
                            游记攻略
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/deals/index.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc"
                           title="季节和假日优惠">
                            季节和假日优惠
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/traveller-awards/index.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc">
                            Traveller Review Awards
                        </a>
                    </li>
                </ul>
            </div>
            <div class="footer-navigation-links-column">
                <ul class="footer-navigation-links-list col-xs-6 col-md-2">
                    <li class="footer-navigation-link">
                        <a rel="nofollow"
                           href="http://cars.booking.com/Home.do?affiliateCode=booking-com&amp;adplat=footer&amp;preflang=zh-cn"
                           target="_blank"
                           data-google-track="Click/Rental cars footer link click (loy_footer_rentalcars_copy: 0)/index"
                           data-ga-track="click|pageview:/outgoinglink/traveljigsaw/zh">
                            租车服务
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a rel="nofollow"
                           href="https://booking.cn/pxgo?url=https%3A%2F%2Fbooking.kayak.com%2Fin%3Fa%3Dbdc%252Ffooter_link%26p%3Dfooter_link%26sid%3D1c3c74b8ebf43b98ff7f33d85a5ffadc%26mc%3DCNY%26bdclc%3Dzh-cn&amp;token=UmFuZG9tSVYkc2RlIyh9Yb5s-oRzgw76bcWUd8wbcu_HQ_oNS0n5o7zQ4ALMS4xCAz2HhcKhGLwnccOLYQQwIxoA1l8Dn-u7SWMJSrnvF2SlZw8LSyUylQlCcuex9gosnb-4lO3cBh4k55cNqRMSfFPLFXGPgVPZeOUwZXy7_R3yPHWDyJSfMAqwMnH4WY9TRhY0s8ADXBtGbDLIS0T-KtRtFttcYhtDXbuQ7ipS0tb--gvkbygnAE6CDsonH1jwNNquYwxgt-fAFY4IzjwKRYif4ihrj-bn70oWjdeHkcdSByHc3aIq9e3pHTCqMCCtVtwVI2LSsPyn_XU17hLXAA&amp;aid=1633942&amp;lang=zh"
                           target="_blank" data-google-track="Click/Kayak footer link/index"
                           data-ga-track="click|pageview:/outgoinglink/kayaklink">
                            订机票
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a rel="nofollow" href="http://www.opentable.com?ref=16087" target="_blank"
                           data-google-track="Click/Opentable footer link/index"
                           data-ga-track="click|pageview:/outgoinglink/opentablelink">
                            餐厅订位
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="
https://booking.cn/affiliate-program/v2/index.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc&amp;utm_medium=referral&amp;utm_campaign=booking-footer&amp;utm_content=travel-agents-link&amp;utm_source=booking.com
" title="Booking.com for Travel Advisers"
                           data-ga-track="click|pageview:/internallink/partner/footer/adviserslink/index/zh-cn">
                            Booking.com缤客旅行代理机构中心
                        </a>
                    </li>
                </ul>
            </div>
            <div class="footer-navigation-links-column">
                <ul class="footer-navigation-links-list col-xs-6 col-md-3">
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/covid-19-booking-faqs.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc">
                            新冠肺炎（COVID-19）疫情常见问题及解答
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/content/about.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc">关于Booking.com缤客</a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="/content/contact-us.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc">联系我们</a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="/content/business-license.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc">营业执照</a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://secure.booking.cn/help.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc&amp;source=footer_navigation#/?source=footer_navigation"
                           data-ga-track="click|Click|Action: index|hc_entrypoint_footer_navigation">
                            客服帮助
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://partner.booking.com/en-gb?utm_campaign=footer_list&amp;utm_medium=frontend_footer&amp;utm_source=booking.com">
                            酒店自助平台
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://careers.booking.com/?utm_source=corporate&amp;utm_medium=footer"
                           data-ga-track="click|pageview:/outgoinglink/footer/careerlink/zh-cn">
                            Careers
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://sustainability.booking.com/"
                           data-ga-track="click|pageview:/outgoinglink/footer/sustainabilitylink/zh-cn">
                            可持续发展项目
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a class="tracked" data-google-track="Click/Action: about_us/press"
                           href="https://news.booking.com/zh-chs/">
                            新闻中心
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/trust-and-safety.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc&amp;utm_source=footer_menu&amp;utm_medium=web_frontend"
                           class="tracked">
                            安全旅行信息中心
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a class="tracked" data-google-track="Click/Action: about_us/investor_relations"
                           href="https://www.bookingholdings.com/">
                            投资者关系
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/content/terms.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc">
                            条款与条件
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://secure.booking.cn/content/complaints.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc">
                            合作伙伴申诉
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/content/how_we_work.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc">
                            我们如何运作
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.booking.cn/content/privacy.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc">
                            隐私和Cookie声明
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <div style="display:none">
                            <button id="ot-sdk-btn" class="ot-sdk-show-settings">点此</button>
                        </div>
                        <a href="#" class=" ot-preference-center-footer">
                            管理Cookie设置
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="https://www.bookingholdings.com/about/compliance-and-ethics/">
                            MSA声明
                        </a>
                    </li>
                    <li class="footer-navigation-link" data-ga-track="click|CSIR|CS|footer_link_contact_us">
                        <a href="https://www.booking.cn/content/contact-us.zh-cn.html?aid=1633942&amp;label=baidu-brand-list1&amp;sid=1c3c74b8ebf43b98ff7f33d85a5ffadc">
                            其他问题查询
                        </a>
                    </li>
                    <li class="footer-navigation-link">
                        <a href="#" title="
最优惠价格保证 - 核实后将予以差价补偿！
" class="
jq_tooltip
open-bpg-in-overlay-instead
">价格更放心</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>
<script src="../static/js/jquery-3.6.4.min.js"></script>
<script src="../static/bootstrap-3.4.1-dist/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript">
    //测试
    function checker() {
        var username = document.getElementById("mydatepicker").value;
        var username1 = document.getElementById("mydatepicker1").value;
        if (username == "" || username1 == "") {
            alert("预定时间不为空");
        }
    }

    function show_star() {
        var star = $("#show_stars").text();
        var star_position = $("#show_stars");
        var star_good_position = $("#star_good");
        for (var i = 0; i < star; i++) {
            star_position = star_position.next();
            star_position.removeClass("star_hide");
        }
        if (star >= 4) {
            star_good_position.removeClass("star_hide");
        }
    }

    show_star();

    function show_pin() {
        let point = $("#pinfen").text();
        console.log(point);
        var pinji = "";
        if (point > 9.5 && point <= 10)
            pinji = "优异的";
        else if (point > 9 && point <= 9.5)
            pinji = "好极了";
        else if (point > 8 && point <= 9)
            pinji = "很棒";
        else if (point > 7 && point <= 8)
            pinji = "好";
        else {
            pinji = "一般";
        }
        $("#pinji").text(pinji);
    }

    show_pin();

    function set_person() {
        var nums = $("#show_peoples").text();
        console.log(nums);
        var per_html = '';
        for (var i = 0; i < nums; i++) {
            per_html += `<svg class="bk-icon -streamline-person_half" height="16" width="16" viewBox="0 0 24 24"
                             role="presentation" aria-hidden="true" focusable="false"><path
                                d="M16.5 6a4.5 4.5 0 1 1-9 0 4.5 4.5 0 0 1 9 0zM18 6A6 6 0 1 0 6 6a6 6 0 0 0 12 0zM3 23.25a9 9 0 1 1 18 0 .75.75 0 0 0 1.5 0c0-5.799-4.701-10.5-10.5-10.5S1.5 17.451 1.5 23.25a.75.75 0 0 0 1.5 0z"></path></svg>
                        `
        }
        console.log(per_html);
        var temp = $("#max_people_icon");
        console.log(temp.innerHTML);
        document.querySelector('#max_people_icon').innerHTML = per_html;

    }

    set_person();
</script>
</body>
</html>